﻿@model MVCApp.Models.District

@{
    int counter = Model.UserReports_DistrictComplete.Count;
    string displayDateFormat = @"dd-MM-yyyy";
    string actualDateFormat = @"MM-dd-yyyy";

    DateTime minDate = Model.UserReport_MinDateForCompletion.Date;
}

<div id="reportCompletion">

    @using (Ajax.BeginForm("Create", "DistrictReport", new { type =  MVCApp.Models.DistrictReport.ReportTypes.Complete},
        new AjaxOptions
        {
            HttpMethod = "post",
            InsertionMode = InsertionMode.Replace,
            UpdateTargetId = "reportCompletion",
            Confirm = String.Format(Strings.DistrictReportCompleteConfirm, Model.Name),
            LoadingElementId = "ajaxLoader",
            OnFailure = "reportCompletionFailure",
            OnBegin = "validateDate"
        }))
    {
        @Html.HiddenFor(d => d.Id);
         

        <div class="editor-field">
            @Strings.Date:
            <input type="text" id="displayDate" value="@DateTime.Now.ToString(displayDateFormat)"/>
            <input type="hidden" id="altDate" name="date" value="@DateTime.Now.ToString(actualDateFormat)"/>
        </div>
        <div class="button">
            <input type="submit" value="@Strings.Send" />
        </div>
    }
      
    <div id="ajaxLoader" style="display:none">
        <img src="~/Images/ajax-loader.gif">
    </div>

    @if(ViewBag.ReportSuccessful == true)
    {
        <div class="infoMessage">@Strings.DistrictReportCompleteThanks</div>
    }

    @if (Model.UserReports_DistrictComplete.Count > 0)
    {
    <table>
        <tr>
            <th>
                @Strings.YourCompletions
            </th>
        </tr>

        @foreach (var item in Model.UserReports_DistrictComplete)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Date)
                </td>
            </tr>
        }
    </table>
    }
</div>

<script>

    $(function () {
        $('#displayDate').datepicker({
            dateFormat: 'dd-mm-yy',
            altFormat: "mm-dd-yy",
            altField: "#altDate",
            minDate: new Date(@minDate.Year, @minDate.Month - 1, @minDate.Day),
            maxDate: new Date()
        });
    });

    function reportCompletionFailure(ajaxContext) {
        alert("@Strings.UnexpectedErrorOccured");
    }

    function validateDate(ajaxContext) {
        var inputDate = $("#displayDate").datepicker("getDate");
        var maxDate = $("#displayDate").datepicker("option", "maxDate");
        var minDate = $("#displayDate").datepicker("option", "minDate");
        
        var result = inputDate >= minDate && inputDate <= maxDate;

        if (!result) {
            alert("@Strings.DistrictReportInvalidDate");
        }

        return result;
    }

</script>